<template>
    
    <el-dialog :model-value="isShow" width="80%" :close-on-click-modal="false"
    @open="onOpen">

        <div>
            <div class="flex">
                <!-- 搜索 -->
                <div class="w-xs mr">
                    <el-input v-model="name" clearable placeholder="输入书籍名搜索" class="filter-item" />
                </div>
                <el-button class="filter-item" type="success" @click="onSearch">
                    <el-icon :size="20" class="mr-1">
                        <IconIcBaselineSearch />
                    </el-icon>搜索
                </el-button>
            </div>

            <el-table :data="list" v-loading="loading" class="mt" highlight-current-row ref="table"
                @current-change="handleCurrentChange">
                <el-table-column prop="hostName" label="站点" />
                <el-table-column prop="name" label="书名" />
                <el-table-column prop="author" label="作者" />
                <el-table-column prop="isInstalment" label="连载" />
                <el-table-column prop="updateTime" label="更新时间" />
                <el-table-column prop="lastChapter" label="最新章节" />
            </el-table>
        </div>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="onCancel">取消</el-button>
                <el-button type="primary" @click="onConfirm">
                    确定
                </el-button>
            </span>
        </template>
    </el-dialog>
</template>
  
<script>
import { queryData } from '@/api/novel/spider'
import { save } from '@/api/novel/index'
export default {
    props: {
    data: {
      // required: true,
      type: Object,
      default: null
    },
    isShow: {
      require: true,
      type: Boolean,
      default: false
    },
    title: {
      // require: true,
      type: String,
      default: ""
    }
  },
  emits: ['onChange','update:isShow'],
    data() {
        return {
            name: '',
            dialogVisible: false,
            loading: false,
            list: [],
            currentRow: {}
        };
    },
    created() {

    },
    methods: {
        async onOpen() {
          //  console.log(this.data)
        if (this.data) {
           // console.log(this.data)
            this.name = this.data.name
            this.getInfo()
        }

        },
        async getInfo() {
            this.loading = true
            try {
                var response = await queryData(this.name)

                this.list = response.result

            }
            finally {
                this.loading = false
            }
        },
        async onConfirm() {
            this.loading = true
            await save(this.currentRow)
            this.loading = false

            this.$emit("update:isShow", false)
        },
        onCancel() {
            this.$emit("update:isShow", false)
        },
        handleCurrentChange(val) {
            this.currentRow = val
        },

        onSearch() {
            this.getInfo()
        }
    }
}
</script>
  